<template>
  <div>
    <v-nav></v-nav>
    <img src="@/components/rencai.png" alt="" style="width: 100%;display: block">
    <div class="j-brief">
      <router-link to="/society" tag="span" class="active">社会招聘</router-link>
      <router-link to="/school" tag="span">校园招聘</router-link>
    </div>
    <div class="main w690">
      <span>{{listData.post_title}}</span>
      <!-- <button>投递简历</button> -->
    </div>
    <div class="w690 details">
      <h3>岗位职责</h3>
      <p v-html="listData.post_zhize"></p>
      <h3 style="margin-top: .4rem">任职要求</h3>
      <p v-html="listData.post_excerpt"></p>
    </div>
    <div class="foot">
      <v-footer></v-footer>
    </div>
  </div>
</template>

<script>
import vNav from '@/components/nav/nav'
import vFooter from '@/components/footer'
import { getProductInfoData } from '@/services/api.js'
export default {
  data () {
    return {
      lists: [],
      id: null,
      listData: []
    }
  },
  components: {
    vNav,
    vFooter
  },
  methods: {
    _getChList () {
      let params = {
        id: this.id
      }
      getProductInfoData(params).then((res) => {
        this.listData = res
      })
    }
  },
  created () {
    this.id = this.$route.params.id
    this._getChList()
    console.log('所发生的')
    console.log(this.id)
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
@import '@/util/common.scss';
.active {
  background-color: #2154b9;
  color: #fff!important;
}
h1 {
  padding: 36rem/$font-size-base 0;
  font-size: 30rem/$font-size-base;
  letter-spacing: 1px;
  color: #333;
  font-weight: bolder;
  text-align: left;
  padding-left: 30rem/$font-size-base;
}
.main {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 20rem/$font-size-base;
  padding-bottom: 35rem/$font-size-base;
  span {
    font-size: $baseFontSize2;
    color: #333
  }
  button {
    outline: none;
    border: 0;
    width: 230rem/$font-size-base;
    height: 65rem/$font-size-base;
    border-radius: 4px;
    background-color: #2154b9;
    font-size: $baseFontSize;
    color: #fff
  }
}
.details {
  padding-bottom: 30rem/$font-size-base;
  h3 {
    font-size: $baseFontSize;
    color: $highLightColor;
    margin-bottom: 26rem/$font-size-base
  }
  p {
    font-size: $baseFontSize;
    color: $secondLevelColor
  }
}
// .foot {
//   width: 100%;
//   position: fixed;
//   bottom: 0
// }
</style>
